.strong
    font-weight bold
.index
    // padding 28rpx 30rpx 140rpx
    width 100%
    height 100vh
    background #fff
    .header
        // background url('http://pic.sc.chinaz.com/files/pic/pic9/201610/fpic7918.jpg')
        // padding 28rpx 30rpx 28rpx
        // margin-bottom 68rpx
        position absolute
        top 30%
        left 66rpx
        right 66rpx
        text-align center
        // transform translateY(-50%)
        .type-item
            width 260rpx
            height 260rpx
            border-radius 10rpx
            margin-bottom 48rpx
    .type-container
        display flex
        justify-content space-between
        flex-wrap wrap
        padding 30rpx 77rpx
        .type-item
            width 260rpx
            height 260rpx
            border-radius 10rpx
            margin-bottom 48rpx
            &.recyclable
                background #0075C2
            &.harmful
                background #e80016
            &.wet
                background #009944
            &.dry
                background #F7AC00
    .input-box 
        // position absolute
        // top 50%
        // left 30rpx
        // right 30rpx
        display flex
        align-items center
        // width 100%
        height 88rpx
        box-sizing border-box
        padding 0 30rpx
        background #eee
        border-radius 80rpx
        border 1rpx solid #eee 
        .placeholder  
            margin-left 12rpx
            font-size 28rpx
            color #999
        .icon-camera
            width 50rpx
            height 50rpx
            margin-left auto
    .banner
        width 100%
        border-radius 10rpx
    .img 
        width 546rpx
        height 546rpx
    .tab-container
        display flex
        position sticky
        top 0
        z-index 999
        // align-items center
        background #fff
        border-bottom 1rpx solid #eee
        padding-top: 18rpx
        .tab-item 
            flex 1
            height 60rpx
            line-height 60rpx
            text-align center
            font-size 28rpx
            color #000
            &.recyclable
                color #0075C2
            &.harmful
                color #e80016
            &.wet
                color #009944
            &.dry
                color #F7AC00
            &.active
                // font-size 28rpx
                // font-weight bold
                // border-bottom 1rpx solid #000
            &.hover-bg
                // background #eee
    .title
        position fixed
        right 30rpx
        bottom 200rpx
        font-weight bold
        display flex
        align-items center
        font-size 28rpx
        color #000
        background #eee
        padding 0 24rpx
        height 60rpx
        border-radius 60rpx
        // margin-top 48rpx
        // border-bottom 1rpx solid #999
    .nav-bar
        position fixed
        // display flex
        // align-items center
        .btn-wrap
            display flex
            // width 174px
            // height 64px
            border 1px solid #eee
            border-radius 100px
            background #fff
            &::after
                content: ''
                height 40rpx
                width 1rpx
                background #eee
                position absolute
                left 50%
                top 50%
                transform translate(-50%, -50%) 
            .Image-wrap
                width 50%
                display flex
                align-items center
                justify-content center
                position relative
                .share-btn
                    position absolute
                    top 0
                    right 0
                    bottom 0
                    left 0
                    opacity 0
                Image
                    width 40rpx
                    height 40rpx
            

                
